<template>
	<div class="content-wrap">
		<span class="ipt-tips">查询密码</span>
		<Form ref="search" class="search-box">
			<FormItem v-for="(item, index) in keepText" :key="index">
				<Input type="text" v-model="password[index]" size="large" :placeholder="'设备密码' + item"></Input>
			</FormItem>
			<!-- <div v-for="item in items"></div> -->
		</Form>
		<div class="keep-pwd">
			<i-switch v-model="switch1" @on-change="change">
				<span slot="open">开</span>
				<span slot="close">关</span>
			</i-switch>
			<span>记住密码</span>
		</div>
	</div>
</template>

<script>
export default {
	data() {
		return {
			keepText: ['1', '2', '3', '4', '5', '6'],
			password: [], // 记录密码
			switch1: false // 是否记住密码
		}
	},
	methods: {
		change(status) {
			this.$Message.info('记住密码:' + status);
		}
	}
}
</script>

<style lang="less" scoped>
.content-wrap {
	color: #999;

	.search-box {
		padding: 20px 20px 0;
	}

	.ipt-tips {
		display: block;
		padding: 5px;
		text-align: center;
		font-size: 1.15em;
		border-bottom: 10px solid#ddd;
		color: #888;
		font-weight: 700;
	}

	.keep-pwd {
		border-top: 10px solid #ddd;
		padding: 20px;

		>span {
			margin-right: 10px;
		}
	}
}
</style>
